<template>
  <view>
	<uni-section :subTitle="`备忘录数量：${Memorandum.length}`">
		<uni-search-bar type="text" v-model="searchText" @input="handleSearch" placeholder="搜索" bgColor="#EEEEEE" @confirm="search" />
	</uni-section>
	<view v-if="Memorandum.length">
		<memorandum v-for="(item ,index) in Memorandum" :key="index" :memo="item"></memorandum>
	</view>
	<image class="add" src="/static/img/add.png" @click="add()"></image>
  </view>
</template>
 
<script>
	import memorandum from '@/components/Memorandum.vue';
export default {
	components: {
		memorandum
	},
	data() {
		return {
			searchText: "",
			token:"",
			Memorandum: []
		};
	},
	onLoad() {
		uni.getStorage({
			key:'token',
			success: res=>{
				// console.log(res.data);
				this.token=res.data
				this.loadList(); // 在获取 token 成功后加载备忘录列表
			}
		});
	},
	onShow() {
	    this.loadList();
	},
	watch: {
	    searchText(newVal) {
	      this.search(newVal);
	    }
	  },
	methods: {
		loadList(){
			this.Memorandum=[];
			uni.request({
				url:'http://8.130.170.106:9999/memorandum/loadList',
				header:{
					token:this.token
				},
				success: (res) => {
					console.log(res);
					if (res.data === null) {
						// 如果返回数据为 null，给 Memorandum 数组赋一个空数组
						this.Memorandum = [];
					} else {
						res.data.forEach((item,index) => {
							this.Memorandum.push({
								bId: item.bid,
								title: item.title,
								date: item.date,
								content: item.content
							});
						});
					}
					
				}
			})
		},
		search(query) {
			// this.Memorandum=[];
		      uni.request({
		      	url:'http://8.130.170.106:9999/memorandum/fuzzySearch',
				data:{
					content: query
				},
				header:{
					token:this.token
				},
		      	success: (res) => {

					this.Memorandum = res.data.map((item) => ({
					        bId: item.bid,
					        title: item.title,
					        date: item.date,
					        content: item.content
					}));
		      		
		      	}
		      })
		    },
		    handleSearch() {
		      // 在输入变化时触发搜索
		      this.search(this.searchText);
		    },
			add(){
			  uni.navigateTo({
			    url:'/pages/main/tabbar/tabbar-4/insert',
			    success: () => {
			      console.log("跳转成功");
			    },
			    fail: (err) => {
			      console.log("跳转失败", err);
			    }
			  });
			}
	}
	
}
</script>
 
<style>
	.add{
		position: absolute;
		width: 50px;
		height: 50px;
		right: 10px; /* 距离右侧的距离 */
		bottom: 10px; /* 距离底部的距离 */		
	}
</style>